import React from 'react'
import axios from '../../api/axios'
import { useNavigate } from 'react-router-dom'
import {
  Form,
  Input,
  Button,
  Toast,
} from 'antd-mobile'
function Index() {
     let navigate=useNavigate()
     const onFinish =async (values) => {
      const res=await axios.post('/api/login',values)  
      console.log(res);
      const {code,message,data}=res.data
      if(code==200){
        Toast.show(message)
        localStorage.setItem('token',data.token)
        localStorage.setItem('userInfo',JSON.stringify(data.userInfo))
        navigate('/')
      }
      else{
        Toast.show(message)
      }
      
   
  }
  return (
    <div>
     <Form
       onFinish={onFinish}
        layout='horizontal'
        footer={
          <Button block type='submit' color='primary' size='large'>
            提交
          </Button>
        }
      >
        <Form.Header>水平布局表单</Form.Header>
        <Form.Item
          name='username'
          label='姓名'
          rules={[{ required: true, message: '姓名不能为空' }]}
        >
          <Input  placeholder='请输入姓名' />
        </Form.Item>
         <Form.Item
          name='password'
          label='密码'
          rules={[{ required: true, message: '密码不能为空' }]}
        >
          <Input  placeholder='请输入密码' />
        </Form.Item>
      </Form>
    </div>
  )
}

export default Index
